<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

      <!-- 准备好一个容器 -->
      <div id="root">


      </div>


    <script type="text/javascript">
        
        let data ={
            name:'翔宇医疗',
            address:'河南内黄'
        }
        
        const obs =  new Observer(data);
        console.log(obs);

        //准备一个vm实例对象
        let vm = {}
        vm._data = data = obs;

        //
        function Observer(obj) {
            //汇总对象中所有的属性形成一个数组
            const keys = Object.keys(obj);
            //遍历
            keys.forEach((k)=>{
                Object.defineProperty(this,k,{
                    get(){return obj[k]},
                    set(val){
                        console.log('${k}被改了');
                        obj[k] = val
                    }
                })
            })
        }//end 

      
    </script>
</body>
</html>